<!--#include file="common_head.html"-->
<div class="uk-offcanvas-content">
    <div class="dux-pro-filter-fixed">
<div class="dux-pro-filter">
        <ul class="uk-grid uk-grid-collapse uk-child-width-expand uk-text-center">
            <!--loop{$orderList as $vo}-->
            <li>
                <!--if{$vo.up || $vo.down}-->
                    <a href="{$vo.url}" class="dux-text-secondary"> {$vo.name}
                    <i class="icon-arrow {$vo.up ? 'up' : 'down'}"></i>
                <!--{else}-->
                    <a href="{$vo.url}"> {$vo.name}
                    <i class="icon-arrow"></i>
                <!--{/if}-->
            </a></li>
            <!--{/loop}-->
            <li>
                <a href="#list-select"  uk-toggle>筛选</a></li>
        </ul>
</div>
    </div>
    <div id="list-select" class="" uk-offcanvas="flip: true; overlay: true">
        <div class=" uk-offcanvas-bar dux-filter-side">

            <form action="{url('index', ['id' => $classInfo.class_id])}" method="get">

                <div class="side-title">
                    <h3>品牌</h3>
                    <i class="arrow"></i>
                </div>
                <ul class="side-list uk-grid uk-grid-collapse uk-child-width-1-3">
                    <!--loop{$brandList as $vo}-->
                    <li>
                        <label>
                            <input type="radio" value="{$vo.brand_id}" name="brand" {$vo.cur ? 'checked' : ''}>
                            <div class="title">{$vo.name}</div>
                        </label>
                    </li>
                    <!--{/loop}-->
                </ul>

                <div class="side-title">
                    <h3>价格</h3>
                </div>
                <div class="side-limit">
                    <span class="num">
                    <input type="text" placeholder="最低价" name="min_price" value="{$pageParams.min_price}">
                        </span>
                    <span class="split"> - </span>
                    <span class="num">
                    <input type="text" placeholder="最高价" name="max_price" value="{$pageParams.max_price}">
                        </span>
                </div>
                <ul class="side-list uk-grid uk-grid-collapse uk-child-width-1-3">
                    <!--loop{$priceList as $vo}-->
                    <li>
                        <label>
                            <input type="radio" name="price_attr" value="{$vo.value}" {$vo.cur ? 'checked' : ''}>
                            <div class="title">{$vo.name}</div>
                        </label>
                    </li>
                    <!--{/loop}-->
                </ul>

                <script>
                    Do('base', function () {
                        $('input[name="price_attr"]').on('change', function () {
                            var attr = $(this).val();
                            attr = attr.split("_");
                            $('input[name="min_price"]').val(attr[0]);
                            $('input[name="max_price"]').val(attr[1]);
                        });
                    });
                </script>

                <!--loop{$attrList as $vo}-->
                <div class="side-title">
                    <h3>{$vo.name}</h3>
                </div>
                <ul class="side-list uk-grid uk-grid-collapse uk-child-width-1-3">
                    <li>
                        <!--loop{$vo.value as $k => $v}-->
                        <label>
                            <input type="radio" name="attr_{$vo.attr_id}" value="{$k ? $v.name : ''}" {$v.cur ? 'checked' : ''}>
                            <div class="title">{$v.name}</div>
                        </label>
                        <!--{/loop}-->
                    </li>
                </ul>
                <!--{/loop}-->

                <div class="side-title">
                    <h3>服务</h3>
                </div>
                <ul class="side-list uk-grid uk-grid-collapse uk-child-width-1-3">
                    <li>
                        <label>
                            <input type="radio" name="free_express" value="0"  {$urlParams.free_express == 0 ? 'checked' : '' }>
                            <div class="title">全部</div>
                        </label>
                    </li>
                    <li>
                        <label>
                            <input type="radio" name="free_express" value="1" {$urlParams.free_express ? 'checked' : '' }>
                            <div class="title">包邮</div>
                        </label>
                    </li>
                </ul>
                <div class="side-action">
                    <button type="reset" class="uk-button uk-button-default">重置</button>
                    <button type="submit" class="uk-button uk-button-primary">完成</button>
                </div>
        </div>
        </form>
    </div>


</div>

<main class="dux-main">
    <!--if{$pageList}-->
    <div data-dux="page-ajaxPage" data-list="#list" data-tpl="#list-tpl" data-url='{url("ajax", $urlParams)}' data-page="1">
    <ul class="dux-pro-list" id="list">
    </ul>
    <!--{else}-->
    <div class="uk-padding uk-text-center">
        <h2>暂无相关商品</h2>
    </div>
    <!--{/if}-->

</main>

<script type="text/html" id="list-tpl">
    {{# for(var i = 0, len = d.length; i < len; i++){ }}
    <li>
        <a class="dux-pro-item " href="{{ d[i].url }}">
            <div class="item-img">
                <img src="{{ d[i].image }}" alt="{{ d[i].title }}">
            </div>
            <div class="item-info">
                <div class="title">{{ d[i].title }} {{ d[i].subtitle }}</div>
                <div class="price">
                    ￥{{ d[i].sell_price }}
                    <small>￥{{ d[i].market_price }}</small>
                </div>
                <p>
                    {{ d[i].sale }}人购买
                </p>
            </div>
        </a>
    </li>
    {{# } }}
</script>
<!--#include file="common_nav.html"-->
</body>
<!--#include file="common_foot.html"-->

</html>